<style type="text/css">
    .plupload_container {
        max-height:200px;
        max-width: 500px;
        position: relative;
    }
</style>
<div id="product-template-detail" class="modal fade">
  <div class="modal-dialog modal-lg" >
    <div class="modal-content">
      <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
          <h4 class="modal-title">商品模板编辑</h4>
      </div>
      <div class="modal-body">
				<div class="row">
					<br>
					<form id="product-template-form" method="post">
					<div class="form-group">
						<div class="col-sm-12">
							<div class="col-sm-1"></div>
						<div class="col-sm-3" style="padding-top:5px">
							<label for="a_repository" class="control-label">仓库A：</label>
						</div>
						<div class="col-sm-6">
				      <select class="form-control" id="a_repository_id" multiple="multiple">
							</select>
				    </div>	
				  	</div>
				  	<div class="col-sm-12">
				  		<br>
							<div class="col-sm-1"></div>
						<div class="col-sm-3" style="padding-top:5px">
							<label for="b_repository" class="control-label">仓库B：</label>
						</div>
						<div class="col-sm-6">
							<select class="form-control" id="b_repository_id" multiple="multiple">

							</select>
						</div>
				  	</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="name" class="control-label">商品名称：</label>
						</div>
						<div class="col-sm-6">
							<input id="product_template_id" name="product_template_id" class="form-control" style="display:none;"></input>
							<input id="name" name="name" class="form-control"></input>
						</div>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
					    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
								<label for="subname" class="control-label">商品副标题：</label>
							</div>
							<div class="col-sm-6">
								<input id="subname" name="subname" class="form-control"></input>
							</div>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="barcode" class="control-label">商品条形码货号：</label>
						</div>
						<div class="col-sm-6">
							<input id="barcode" name="barcode" class="form-control"></input>
						</div>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="key" class="control-label">关键字：</label>
						</div>
						<div class="col-sm-6">
							<input id="key" name="key" class="form-control"></input>
						</div>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="index" class="control-label">排序：</label>
						</div>
						<div class="col-sm-6">
							<input id="index" name="index" class="form-control"></input>
						</div>
						</div>
						<div class="col-sm-12">
							<br>
							<div class="col-sm-1"></div>
							<div class="col-sm-3" style="padding-top:5px">
								<label for="class1" class="control-label">商品类别：</label>
							</div>
							<div class="col-sm-6">
					      <ul id="product_class_tree" class="ztree"></ul>
					    </div>	
				  	</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
					    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
								<label class="control-label">商品图片：</label>
								<br><br>
                <span class="control-label">已上传的图片：</span>
								<div id="img"></div>
							</div>
							<div class="col-sm-6">
								<div id="uploadImg">
							    <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
								</div>
							</div>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
					    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
								<label class="control-label">商品缩略图片：</label>
								<br><br>
	              <span class="control-label">已上传的图片：</span>
								<div id="smimg"></div>
							</div>
							<div class="col-sm-6">
								<div id="uploadSMImg">
							    <p>Your browser doesn't have Flash, Silverlight or HTML5 support.</p>
								</div>
							</div>
						</div>
						<div class="col-sm-12">
				      <br>
				      <div class="col-sm-1"></div>
				      <div class="col-sm-3">
				          <label class="control-label">商品标签：</label>
				      </div>
				      <div class="col-sm-6">
				          <input id="tag" value="1" type="checkbox" name="tag"></input><label for="tag" class="control-label">&nbsp;满9元包邮</label>
				      </div>
				  	</div>
						<div class="col-sm-12">
				      <br>
				      <div class="col-sm-1"></div>
				      <div class="col-sm-3">
				          <label class="control-label">派送方式：</label>
				      </div>
				      <div class="col-sm-2">
				          <input id="sendtype0" value="0" type="radio" name="sendtype"></input><label for="sendtype0" class="control-label">&nbsp;39分钟送达</label>
				      </div>
				      <div class="col-sm-2">
				          <input id="sendtype1" value="1" type="radio" name="sendtype"></input><label for="sendtype1" class="control-label">&nbsp;49分钟送达</label>
				      </div>
				      <div class="col-sm-2">
				          <input id="sendtype2" value="2" type="radio" name="sendtype"></input><label for="sendtype2" class="control-label">&nbsp;59分钟送达</label>
				      </div>
				      <div class="col-sm-2">
				          <input id="sendtype3" value="3" type="radio" name="sendtype"></input><label label for="sendtype3" class="control-label">&nbsp;次日送达</label>
				      </div>
				  	</div>
				  	<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
					    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
								<label for="jh_price" class="control-label">进货价格：</label>
							</div>
							<div class="col-sm-6">
								<input id="jh_price" name="jh_price" class="form-control"></input>
							</div>
							<label class="control-label" style="padding-top:5px">元</label>
						</div>
				  	<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
					    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
								<label for="sc_price" class="control-label">市场售价：</label>
							</div>
							<div class="col-sm-6">
								<input id="sc_price" name="sc_price" class="form-control"></input>
							</div>
							<label class="control-label" style="padding-top:5px">元</label>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
					    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
								<label for="kj_price" class="control-label">快驹售价：</label>
							</div>
							<div class="col-sm-6">
								<input id="kj_price" name="kj_price" class="form-control"></input>
							</div>
							<label class="control-label" style="padding-top:5px">元</label>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
					    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
								<label for="default_amount" class="control-label">默认库存量：</label>
							</div>
							<div class="col-sm-6">
								<input id="default_amount" name="default_amount" class="form-control"></input>
							</div>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="warning_amount" class="control-label">默认库存警告量：</label>
						</div>
						<div class="col-sm-6">
							<input id="warning_amount" name="warning_amount" class="form-control"></input>
						</div>
						</div>
						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="origin_amount" class="control-label">原始库存量：</label>
						</div>
						<div class="col-sm-6">
							<input id="origin_amount" name="origin_amount" class="form-control"></input>
						</div>
						</div>

						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="scale" class="control-label">规格：</label>
						</div>
						<div class="col-sm-6">
							<input id="scale" name="scale" class="form-control"></input>
						</div>
						</div>

						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="origin_place" class="control-label">产地：</label>
						</div>
						<div class="col-sm-6">
							<input id="origin_place" name="origin_place" class="form-control"></input>
						</div>
						</div>

						<div class="col-sm-12">
				  		<br>
				  		<div class="col-sm-1"></div>
				    <div class="col-sm-3" style="padding-left:15px;padding-top:5px">
							<label for="product_detail" class="control-label">产品描述：</label>
						</div>
						<div class="col-sm-8">
							<textarea id="product_detail" name="product_detail" class="form-control"></textarea>
						</div>
						</div>
					</div>
					</form>
				</div>
			</div>
			<div class="modal-footer">
        <button class="btn btn-primary" onclick="save()">保存模板</button>
        <button id="savePriceBtn" class="btn btn-danger" onclick="savePrice()">保存并更新仓库商品价格</button>
        <button class="btn btn-defalt" data-dismiss="modal">取消</button>
      </div>
		</div>
	</div>
</div>
<link rel="stylesheet" href="__PUBLIC__/bower_components/bootstrap-multiselect/dist/css/bootstrap-multiselect.css" type="text/css"/>
<script src="__PUBLIC__/bower_components/bootstrap-multiselect/dist/js/bootstrap-multiselect.js"></script>
<script src="__PUBLIC__/bower_components/ckeditor/ckeditor.js"></script>
<script>
var imgurl = new Array();
var smimgurl;
var editor;
$(document).ready(function() {
		loadRepository();
		loadCKEditor();
		loadPlupload();
});

$('#product-template-detail').on("hidden.bs.modal",function(e){
    $("input[name='product_template_id']").attr('value', '');
    $('#a_repository_id').multiselect('deselect', $('#a_repository_id').val());
    $('#b_repository_id').multiselect('deselect', $('#b_repository_id').val());
    $('#name').attr('value', '');
    $('#subname').attr('value', '');
    $('#barcode').attr('value', '');
    $("input[name='key']").attr('value', '');
    $('#index').attr('value', '');
    //取消树的选择
    var treeObj = $.fn.zTree.getZTreeObj("product_class_tree");
		treeObj.cancelSelectedNode();

		$('#img').html('');
		$('#smimg').html('');
		imgurl = new Array();
		smimgurl = '';
		$('#tag').attr('checked', false);
		$('#sendtype0').attr('checked', false);
		$('#sendtype1').attr('checked', false);
		$('#sendtype2').attr('checked', false);
		$('#sendtype3').attr('checked', false);
		$('#sc_price').attr('value', '');
		$('#kj_price').attr('value', '');
		$('#default_amount').attr('value', '');
		$('#warning_amount').attr('value', '');
		$('#origin_amount').attr('value', '');
		$('#scale').attr('value', '');
		$('#origin_place').attr('value', '');
		editor.setData('');
}); 


function loadRepository(){
	var multiselectSetting = {
		buttonWidth: '400px',
		enableFiltering: true,
		filterPlaceholder: '搜索',
		buttonText: function(options) {
        if (options.length == 0) {
          return '没有选择仓库 ';
        }
        else if (options.length > 6) {
          return '已选择' + options.length + ' 个仓库  ';
        }
        else {
          var selected = '';
          options.each(function() {
            selected += $(this).text() + ', ';
          });
          return selected.substr(0, selected.length -2) + ' ';
        }
      }
	}
	$.ajax({
			url: '{:U("Admin/Repository/getARepository/")}',
			type: 'post',
			dataType: 'json'
		})
		.success(function(data){
			var recv = data.data;
			var html = '';
			for (var i = 0; i < recv.length; i++) {
				html += '<option value="'+recv[i].a_repository_id+'">'+recv[i].name+'</option>';
			};
			$('#a_repository_id').html(html);
			$('#a_repository_id').multiselect(multiselectSetting);
	});

	$.ajax({
			url: '{:U("Admin/Repository/getBRepository/")}',
			type: 'post',
			dataType: 'json'
		})
		.success(function(data){
			var recv = data.data;
			var html = '';
			for (var i = 0; i < recv.length; i++) {
				html += '<option value="'+recv[i].b_repository_id+'">'+recv[i].name+'</option>';
			};
			$('#b_repository_id').html(html);
			$('#b_repository_id').multiselect(multiselectSetting);
	});
}

function loadPlupload(){
	$("#uploadImg").plupload({
    // General settings
    runtimes : 'html5,flash,silverlight,html4',
    url : '{:U("Admin/Product/upload")}',

    // User can upload no more then 20 files in one go (sets multiple_queues to false)
    max_file_count:3,
    chunk_size: '10mb',
    filters : {
        // Maximum file size
        max_file_size : '10mb',
        // Specify what files to browse for
        mime_types: [
            {title : "Image files", extensions : "jpg,gif,png"}
            /* {title : "Zip files", extensions : "zip"}*/
        ]
    },

    // Rename files by clicking on their titles
    rename: false,
    // Sort files
    sortable: true,
    // Enable ability to drag'n'drop files onto the widget (currently only HTML5 supports that)
    dragdrop: true,
    //unique_names:true,
    // Views to activate
    views: {
        list: true,
        thumbs: true, // Show thumbs
        active: 'thumbs'
    },
    // Flash settings
    flash_swf_url : '__PUBLIC__/bower_components/plupload/js/Moxie.swf',

    // Silverlight settings
    silverlight_xap_url : '__PUBLIC__/bower_components/plupload/js/Moxie.xap',

    //确定上传事件
    init: {
        /*FileUploaded: function (up, file, result) {
            alert(result.response);
        }*/
        BeforeUpload:function(uploader,file){
					if(imgurl.length >= 3){
						alert("超过三张图片将会覆盖之前的图片！");
					}
        },
        FileUploaded:function(uploader,file,responseObject){
        	var obj = eval('('+responseObject.response+')'); 
        	if(imgurl.length >= 3){
        		imgurl.shift();
        	}
        	imgurl.push(rootUrl+'/Public/upload/product/' + obj.savename);
        	$('#img').html('<img width="150px" src="'+imgurl[0]+'" />&nbsp;<img width="150px" src="'+imgurl[1]+'" />&nbsp;<img width="150px" src="'+imgurl[2]+'" />');
        },
        UploadComplete:function(up,file){
            //console.log(up);
            //console.log(file);
        }
    }
	});
	$("#uploadSMImg").plupload({
    // General settings
    runtimes : 'html5,flash,silverlight,html4',
    url : '{:U("Admin/Product/upload")}',

    // User can upload no more then 20 files in one go (sets multiple_queues to false)
    max_file_count:1,
    chunk_size: '10mb',
    filters : {
        // Maximum file size
        max_file_size : '10mb',
        // Specify what files to browse for
        mime_types: [
            {title : "Image files", extensions : "jpg,gif,png"}
            /* {title : "Zip files", extensions : "zip"}*/
        ]
    },

    // Rename files by clicking on their titles
    rename: false,
    // Sort files
    sortable: true,
    // Enable ability to drag'n'drop files onto the widget (currently only HTML5 supports that)
    dragdrop: true,
    //unique_names:true,
    // Views to activate
    views: {
        list: true,
        thumbs: true, // Show thumbs
        active: 'thumbs'
    },
    // Flash settings
    flash_swf_url : '__PUBLIC__/bower_components/plupload/js/Moxie.swf',

    // Silverlight settings
    silverlight_xap_url : '__PUBLIC__/bower_components/plupload/js/Moxie.xap',

    //确定上传事件
    init: {
        /*FileUploaded: function (up, file, result) {
            alert(result.response);
        }*/
        BeforeUpload:function(uploader,file){
					if(smimgurl){
						alert("将会覆盖之前的缩略图！");
					}
        },
        FileUploaded:function(uploader,file,responseObject){
        	var obj = eval('('+responseObject.response+')'); 
        	smimgurl = rootUrl + '/Public/upload/product/' + obj.savename;
        	$('#smimg').html('<img width="150px" src="'+smimgurl+'" />');
					//console.log(responseObject);
        },
        UploadComplete:function(up,file){
            //console.log(up);
            //console.log(file);
        }
    }
	});
}

function loadCKEditor(){
  editor = CKEDITOR.replace('product_detail',{
   height : '300px',
   filebrowserBrowseUrl : '__PUBLIC__/bower_components/ckeditor/ckfinder/ckfinder.html',
   filebrowserImageBrowseUrl : '__PUBLIC__/bower_components/ckeditor/ckfinder/ckfinder.html?Type=Images',
   filebrowserFlashBrowseUrl : '__PUBLIC__/bower_components/ckeditor/ckfinder/ckfinder.html?Type=Flash',
   filebrowserUploadUrl : '__PUBLIC__/bower_components/ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Files',
   filebrowserImageUploadUrl : '__PUBLIC__/bower_components/ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images',
   filebrowserFlashUploadUrl : '__PUBLIC__/bower_components/ckeditor/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Flash'
 });
}

function save(){
	var a_repository_id = $("#a_repository_id").val();
	var b_repository_id = $("#b_repository_id").val();
	if(a_repository_id == null && b_repository_id == null){
		alert("请选择A仓库或B仓库！");
		window.location.href="#b_repository_id";
		return;
	}

	var treeObj = $.fn.zTree.getZTreeObj("product_class_tree");
	var nodes = treeObj.getSelectedNodes();
	if(nodes.length == 0 || nodes[0].type != '3'){
		alert("请选择一个商品小类！");
		window.location.href="#product_class_tree";
		return;
	}
	var class3 = nodes[0].product_class_id;
	var class2 = nodes[0].parent_id;
	var class1 = nodes[0].getParentNode().parent_id;
	while(imgurl.length > 3){
		imgurl.shift();
	}

	if(imgurl.length != 3){
		alert("商品图片必须上传3个！");
		console.log(imgurl);
		window.location.href="#uploadImg";
		return;
	}

	if(!smimgurl){
		alert("商品缩略图片必须上传1个！");
		window.location.href="#uploadSMImg";
		return;
	}

	if($('#default_amount').val() > $('#origin_amount').val()){
		alert("商品默认库存量应小于原始量！");
		window.location.href="#default_amount";
		return;
	}

	$('#product-template-form').ajaxSubmit({
			url:'{:U("Admin/Product/updateProductTemplate")}',
			data:{
				'a_repository_id':a_repository_id,
				'b_repository_id':b_repository_id,
				'class1':class1,
				'class2':class2,
				'class3':class3,
				'imgurl':imgurl,
				'smimgurl':smimgurl,
				'product_detail':editor.getData()
			},
      success:function(data){
      	//console.log(data);
        $('#product-class-detail').modal('hide');
        location.reload();
      }
  });
	
}

function savePrice(){
	var a_repository_id = $("#a_repository_id").val();
	var b_repository_id = $("#b_repository_id").val();
	if(a_repository_id == null && b_repository_id == null){
		alert("请选择A仓库或B仓库！");
		window.location.href="#b_repository_id";
		return;
	}

	var treeObj = $.fn.zTree.getZTreeObj("product_class_tree");
	var nodes = treeObj.getSelectedNodes();
	if(nodes[0].type != '3'){
		alert("请选择一个商品小类！");
		window.location.href="#product_class_tree";
		return;
	}
	var class3 = nodes[0].product_class_id;
	var class2 = nodes[0].parent_id;
	var class1 = nodes[0].getParentNode().parent_id;
	while(imgurl.length > 3){
		imgurl.shift();
	}

	if(imgurl.length != 3){
		alert("商品图片必须上传3个！");
		console.log(imgurl);
		window.location.href="#uploadImg";
		return;
	}

	if(!smimgurl){
		alert("商品缩略图片必须上传1个！");
		window.location.href="#uploadSMImg";
		return;
	}

	if($('#default_amount').val() > $('#origin_amount').val()){
		alert("商品默认库存量应小于原始量！");
		window.location.href="#default_amount";
		return;
	}

	$('#product-template-form').ajaxSubmit({
			url:'{:U("Admin/Product/updateProductTemplatePrice")}',
			data:{
				'a_repository_id':a_repository_id,
				'b_repository_id':b_repository_id,
				'class1':class1,
				'class2':class2,
				'class3':class3,
				'imgurl':imgurl,
				'smimgurl':smimgurl,
				'product_detail':editor.getData()
			},
      success:function(data){
      	//console.log(data);
        $('#product-class-detail').modal('hide');
        location.reload();
      }
  });
}
</script>